<template>
  <div class="ctnr">
    <div class="list">
      <div class="item">
        <Mimagercrop
          class="mic"
          has-remove
          :value="item"
          :proportion="{ w: 1, h: 1 }"
        ></Mimagercrop>
      </div>
    </div>
  </div>
</template>

<script>
import Mimagercrop from "../components/m-image-crop";
export default {
  components: {
    Mimagercrop
  },
  data() {
    return {
      img: {},
      imgFile: '',
      item: {}
    };
  },
  methods: {
    
  }
};
</script>

<style lang="less">
html,
body {
  margin: 0;
}
.ctnr {
  height: 100vh;
  .list {
    font-size: 0;
    .item {
      box-sizing: border-box;
      font-size: 14px;
      vertical-align: middle;
      display: inline-block;
      border: 1px solid #000;
      width: 33.33vw;
      height: 33.33vw;
      border-radius: 33.33vw;

      img{
      position:absolute;
      width: 33.33vw;
      height: 33.33vw;
      border-radius: 33.33vw;
      }
    }
    .add {
      text-align: center;
      line-height: 33.33vw;
    }
  }
}
</style>
